<template>
	<div id="index" :class="this.$store.getters.isIphoneX ? 'pad-top80' : 'pad-top'">
		<app-header></app-header>
		<app-swiper></app-swiper>
		<scroll-marquee></scroll-marquee>
		<app-machinelist v-on:listenmachineList="machineList"></app-machinelist>
		<add-desktop></add-desktop>
		<right-nav></right-nav>
		<div class="buzouimg" v-if="isnew" v-on:click.stop="goRandom"><img src="../assets/images/buzou1.png" style="width: 100%;"></div>
	</div>
</template>

<script type="text/javascript">
	import appHeader from '../components/homeHeader'
	import scrollMarquee from '../components/scrollMarquee'
	import addDesktop from '../components/addDesktop'
	import appSwiper from '../components/Swiper'
	import appMachinelist from '../components/getMachinelist'
	import rightNav from '../components/rightNav'
	export default{
		name:"index",
		data(){
			return {
				isnew:false,
				List:[],
			}
		},
		components:{appHeader,scrollMarquee,appSwiper,appMachinelist,addDesktop,rightNav},
		watch:{
			'$store.getters.getNew'(){
				this.isnew = this.$store.getters.getNew;
			}
		},
		methods:{
			goRandom(){
				this.isnew = false;
				setTimeout(()=>{
					this.$router.push('/Show?roomid='+this.List[0]['machine_id']);
				},500)
                
            },
            machineList(data){
            	this.List = data;
            }
		}
	}
</script>
<style lang="less" scoped>
	@import '../assets/css/variables.less';
	#index{
		width:100%;
	}
	.buzouimg{
		width:100%;
		height:100%;
		position: fixed;
		top:0;
		left: 0;
		z-index: 11;
	}
</style>